<template>
  <el-dialog title="选择座位" v-model="visible" :close-on-click-modal="false" draggable>
    <el-form ref="changeSeatDialogRef" :model="coreForm" :rules="dataRules" label-width="120px" v-loading="loading">
      <el-form-item label="座位" prop="seatId">
        <el-select v-model="coreForm.seatId"  placeholder="请选择座位" >
          <el-option v-for="(item, index) in seats" :key="item.seatId" :label="item.seatName" :value="item.seatId" />
        </el-select>
      </el-form-item>
    </el-form>
    <template #footer>
			<span class="dialog-footer">
				<el-button type="primary" @click="onSubmit" :disabled="loading">{{ $t('common.confirmButtonText') }}</el-button>
			</span>
    </template>
  </el-dialog>
</template>


<script setup lang="ts" name="CoreDialogFromDialog">
import { seatList, changeSeatState } from '/@/api/infusion/config';
import { useMessage } from '/@/hooks/message';

// 定义子组件向父组件传值/事件
const emit = defineEmits(['refresh']);
let seats = reactive([{
  seatId: '',seatName:'',
}]);

const coreForm = reactive({
  type: '' ,
  coreId: '' ,
  seatId: '' ,
});

// 表单校验规则
const dataRules = reactive({
  seatId: [{ required: true, message: '请选择座位', trigger: 'change' }],
});

// 定义变量内容
const visible = ref(false);
const loading = ref(false);
const changeSeatDialogRef = ref();
onMounted(() => {
  // 获取座位
  getSeatList();
});

const getSeatList = function ()  {
  // 获取部门数据
  seatList().then((res) => {
    seats = res.data;
  });
}
// 打开弹窗
const openDialog = (type:string,coreId: string, seatId: string) => {
  visible.value = true;
  coreForm.type = type;
  coreForm.coreId = coreId;
  coreForm.seatId = seatId;
  // 重置表单数据
  nextTick(() => {
    changeSeatDialogRef.value?.resetFields();
  });
};
// 保存数据
const onSubmit = async () => {
  const valid = await changeSeatDialogRef.value.validate().catch(() => {});
  if (!valid) return false;
  try {
    loading.value = true;
    await changeSeatState(coreForm);
    useMessage().success('修改成功');
    visible.value = false;
    emit('refresh');
  } catch (err: any) {
    useMessage().error(err.msg);
  } finally {
    loading.value = false;
  }
}


// 暴露变量 只有暴漏出来的变量 父组件才能使用
defineExpose({
  openDialog,
});
</script>
